﻿@model IndoReputation.Views.ViewModels.MediaViewModel
@{
    ViewBag.Title = "Add Media";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>
    Add Media</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@using (Html.BeginForm())
{
    @Html.ValidationSummary(false)
    <fieldset>
        @{ Html.Telerik().TabStrip()
        .Name("TabStrip")
        .Items(parent =>
        {
            parent.Add()
            .Text("General Information")
            .Content(
            @<text>
            <div class="form-data">
                <table class="table-data">
                    <tr>
                        <td class="td-label">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.Name, null, true)
                            </div>
                        </td>
                        <td class="td-control">
                            <div class="editor-field">
                                @Html.EditorFor(model => model.Name)
                                @Html.ValidationMessageFor(model => model.Name)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.MediaCategoryID, null, true)
                            </div>
                        </td>
                        <td class="td-control">
                            <div class="editor-field">
                                @( Html.Telerik().ComboBoxFor(model => model.MediaCategoryID)
                                        .Name("MediaCategoryID")
                                        .BindTo(new SelectList(Model.MediaCategory, "Value", "Text"))
                                        .Placeholder("Select Mediacategory")
                                        .SelectedIndex(0)
                                        .Filterable(filtering =>
                                        {
                                            filtering.FilterMode(AutoCompleteFilterMode.Contains);
                                        })
                                        .HighlightFirstMatch(true)
                                        .ClientEvents(events => events.OnChange("ComboBox_onChange"))
                                     )
                                @Html.ValidationMessageFor(model => model.MediaCategoryID)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.Description)
                            </div>
                        </td>
                        <td class="td-control">
                            <div class="editor-field">
                                @Html.EditorFor(model => model.Description)
                                @Html.ValidationMessageFor(model => model.Description)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.IsEnable)
                            </div>
                        </td>
                        <td class="td-control">
                            <div class="editor-field">
                                @Html.CheckBoxFor(model => model.IsEnable)
                                @Html.ValidationMessageFor(model => model.IsEnable)
                            </div>
                        </td>
                    </tr>                    
                </table>
            </div>
            </text>)
            .Selected(true);
            parent.Add()
            .Text("Owner and Reporter")
            .Content(
            @<text>
            <fieldset>
                <legend>Chief editor</legend>
                <div class="form-data">
                    <table class="table-data" width="650">
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.ChiefEditorName)
                                </div>
                            </td>
                            <td class="td-control">
                                <div class="editor-field">
                                    @Html.EditorFor(model => model.ChiefEditorName)
                                    @Html.ValidationMessageFor(model => model.ChiefEditorName)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.ChiefEditorMobile)
                                </div>
                            </td>
                            <td class="td-control">
                                <div class="editor-field">
                                    @Html.EditorFor(model => model.ChiefEditorMobile)
                                    @Html.ValidationMessageFor(model => model.ChiefEditorMobile)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.ChiefEditorEmail)
                                </div>
                            </td>
                            <td class="td-control">
                                <div class="editor-field">
                                    @Html.EditorFor(model => model.ChiefEditorEmail)
                                    @Html.ValidationMessageFor(model => model.ChiefEditorEmail)
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </fieldset>
            <fieldset>
                <legend>Address</legend>
                <div class="form-data">
                    <table class="table-data" width="650">
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddCountry)
                                </div>
                            </td>
                            <td class="td-control">
                                <div class="editor-field">
                                    @(Html.Telerik().AutoCompleteFor(model => model.AddCountry)
                                            .Name("AddCountry")
                                            .Encode(false)
                                            .BindTo(Model.Country)
                                            .AutoFill(false)
                                            .HtmlAttributes(new { style = string.Format("width:{0}px; padding: 7px;", 311) })
                                            .HighlightFirstMatch(true)
                                            .Filterable(filtering =>
                                            {
                                                filtering.FilterMode(AutoCompleteFilterMode.StartsWith);
                                            })
                                            .Multiple(multi =>
                                            {
                                                multi.Separator(",")
                                                    .Enabled(true);

                                            })                                            
                                    )
                                    @Html.ValidationMessageFor(model => model.AddCountry)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddCity)
                                </div>
                            </td>
                            <td class="td-control">
                                <div class="editor-field">
                                    @(Html.Telerik().AutoCompleteFor(model => model.AddCity)
                                            .Name("AddCity")
                                            .Encode(false)
                                            .BindTo(Model.City)
                                            .AutoFill(false)
                                            .HtmlAttributes(new { style = string.Format("width:{0}px; padding: 7px;", 311) })
                                            .HighlightFirstMatch(true)
                                            .Filterable(filtering =>
                                            {
                                                filtering.FilterMode(AutoCompleteFilterMode.StartsWith);
                                            })
                                            .Multiple(multi =>
                                            {
                                                multi.Separator(",")
                                                    .Enabled(true);

                                            })
                                    )
                                    @Html.ValidationMessageFor(model => model.AddCity)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddStreetName)
                                </div>
                            </td>
                            <td class="td-control">
                                 <div class="editor-field">
                                    @Html.EditorFor(model => model.AddStreetName)
                                    @Html.ValidationMessageFor(model => model.AddStreetName)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddStreetNumber)
                                </div>
                            </td>
                            <td class="td-control">
                                 <div class="editor-field">
                                    @Html.EditorFor(model => model.AddStreetNumber)
                                    @Html.ValidationMessageFor(model => model.AddStreetNumber)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddBuildingName)
                                </div>
                            </td>
                            <td class="td-control">
                                 <div class="editor-field">
                                    @Html.EditorFor(model => model.AddBuildingName)
                                    @Html.ValidationMessageFor(model => model.AddBuildingName)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddPhone)
                                </div>
                            </td>
                            <td class="td-control">
                                 <div class="editor-field">
                                    @Html.EditorFor(model => model.AddPhone)
                                    @Html.ValidationMessageFor(model => model.AddPhone)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddFax)
                                </div>
                            </td>
                            <td class="td-control">
                                 <div class="editor-field">
                                    @Html.EditorFor(model => model.AddFax)
                                    @Html.ValidationMessageFor(model => model.AddFax)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddEmail)
                                </div>
                            </td>
                            <td class="td-control">
                                 <div class="editor-field">
                                    @Html.EditorFor(model => model.AddEmail)
                                    @Html.ValidationMessageFor(model => model.AddEmail)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-label">
                                <div class="editor-label">
                                    @Html.LabelFor(model => model.AddWebsite)
                                </div>
                            </td>
                            <td class="td-control">
                                 <div class="editor-field">
                                    @Html.EditorFor(model => model.AddWebsite)
                                    @Html.ValidationMessageFor(model => model.AddWebsite)
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </fieldset>
            <fieldset>
                <legend>Reporter of this media that you know</legend>
                <div id="divReporters">
                    @Html.EditorFor(model => model.ListReporter)
                </div>
                <div style="padding: 10px 0px 10px 0px">
                    <a href='javascript:addNewReporter()'>Add new Reporter</a>
                </div>
            </fieldset>
            </text>)
            .Enabled(false);
            parent.Add()
            .Text("Private Information")
            .Content(
            @<text>
            <div class="form-data">
                <table class="table-data">
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.FirstTimeLaunched)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @(Html.Telerik().DatePickerFor(model => model.FirstTimeLaunched)
                                    .Name("FirstTimeLaunched")
                                    .Value((DateTime)ViewData["selectedDate"])
                                )
                                @Html.ValidationMessageFor(model => model.FirstTimeLaunched)
                            </div>
                        </td>
                    </tr>
                    <tr id="dvTotalPublishedDaily">
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.TotalPublishedDaily, new { id = "lblTotalPublishedDaily" }, false)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @Html.EditorFor(model => model.TotalPublishedDaily)                                
                                @Html.ValidationMessageFor(model => model.TotalPublishedDaily)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.TotalViewersDaily, new { id = "lblTotalViewersDaily" }, false)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @Html.EditorFor(model => model.TotalViewersDaily)
                                @Html.ValidationMessageFor(model => model.TotalViewersDaily)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.ViewerTypeID, new { id = "lblViewerTypeID" }, true)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @(Html.Telerik().ComboBoxFor(model => model.ViewerTypeID)
                                        .Name("ViewerTypeID")
                                        .BindTo(new SelectList(Model.ViewerType, "Value", "Text"))
                                        .Placeholder("Select...")
                                        .SelectedIndex(0)
                                    .Filterable(filtering =>
                                    {
                                        filtering.FilterMode(AutoCompleteFilterMode.Contains);
                                    })
                                    .HighlightFirstMatch(true)
                                   )
                                @Html.ValidationMessageFor(model => model.ViewerTypeID)
                            </div>
                        </td>
                    </tr>
                    <tr id="dvTotalUsers">
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.TotalUsers)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @Html.EditorFor(model => model.TotalUsers)
                                @Html.ValidationMessageFor(model => model.TotalUsers)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.OwnershipTypeID, null, true)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @(Html.Telerik().ComboBoxFor(model => model.OwnershipTypeID)
                                        .Name("OwnershipTypeID")
                                        .BindTo(new SelectList(Model.OwnershipType, "Value", "Text"))
                                        .Placeholder("Select...")
                                        .SelectedIndex(0)
                                    .Filterable(filtering =>
                                    {
                                        filtering.FilterMode(AutoCompleteFilterMode.Contains);
                                    })
                                    .HighlightFirstMatch(true)
                                   )
                                @Html.ValidationMessageFor(model => model.OwnershipTypeID)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.OrientationTypeID, null, true)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @(Html.Telerik().ComboBoxFor(model => model.OrientationTypeID)
                                        .Name("OrientationTypeID")
                                        .BindTo(new SelectList(Model.OrientationType, "Value", "Text"))
                                        .Placeholder("Select...")
                                        .SelectedIndex(0)
                                        .Filterable(filtering =>
                                        {
                                            filtering.FilterMode(AutoCompleteFilterMode.Contains);
                                        })
                                        .HighlightFirstMatch(true)
                                   )
                                @Html.ValidationMessageFor(model => model.OrientationTypeID)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                 @Html.LabelFor(model => model.StrFreedom, null, true)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @(Html.Telerik().ComboBoxFor(model => model.StrFreedom)
                                        .Name("StrFreedom")
                                        .BindTo(new SelectList(Model.Freedom, "Value", "Text"))
                                        .Placeholder("Select...")
                                        .SelectedIndex(0)
                                        .Filterable(filtering =>
                                        {
                                            filtering.FilterMode(AutoCompleteFilterMode.Contains);
                                        })
                                        .HighlightFirstMatch(true)
                                       )
                                @Html.ValidationMessageFor(model => model.IsFreedom)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.StrongInfluenceTypeID, null, true)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @(Html.Telerik().ComboBoxFor(model => model.StrongInfluenceTypeID)
                                                .Name("StrongInfluenceTypeID")
                                                .BindTo(new SelectList(Model.StrongInfluenceType, "Value", "Text"))
                                                .Placeholder("Select...")
                                                .SelectedIndex(0)
                                                .Filterable(filtering =>
                                                {
                                                    filtering.FilterMode(AutoCompleteFilterMode.Contains);
                                                })
                                                .HighlightFirstMatch(true)
                                   )
                                @Html.ValidationMessageFor(model => model.StrongInfluenceTypeID)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-label2">
                            <div class="editor-label">
                                @Html.LabelFor(model => model.RankTypeID, null, true)
                            </div>
                        </td>
                        <td class="td-control2">
                            <div class="editor-field">
                                @(Html.Telerik().ComboBoxFor(model => model.RankTypeID)
                                                .Name("RankTypeID")
                                                .BindTo(new SelectList(Model.RankType, "Value", "Text"))
                                                .Placeholder("Select...")
                                                .SelectedIndex(0)
                                                .Filterable(filtering =>
                                                {
                                                    filtering.FilterMode(AutoCompleteFilterMode.Contains);
                                                })
                                                .HighlightFirstMatch(true)
                                   )
                                @Html.ValidationMessageFor(model => model.RankTypeID)
                            </div>
                        </td>
                    </tr>                    
                 </table>
            </div>
            </text>)
            .Enabled(false);
        })
        .Effects(fx => fx.Expand()
                         .Opacity()
                         .OpenDuration(200)
                         .CloseDuration(300)
        )
        .SelectedIndex(0)
        .Render();
        }
         <div class="form-data">
            <table class="table-data">
                <tr>
                 <td class="td-label"></td>
                 <td class="td-control">
                    <p class="dvbutton">
                        <input type="submit" value="Create" />
                    </p>
                 </td>
                </tr>
            </table>
        </div>        
    </fieldset>
    
    @Html.HiddenFor(model => model.InputJsonMediaShort);
}
<div class="div-back">
    @Html.ActionLink("Back to List", "Index")
</div>
@if (false)
{
    <script src="../../Scripts/jquery-1.7.2-vsdoc.js" type="text/javascript"></script>
}
<script type="text/javascript" language="javascript">
    var jsonMediaShort = null;
    function ComboBox_onChange() {
        var combobox = $(this).data('tComboBox'); // $(this) is equivalent to $('#ComboBox')

        // Use the combobox client object
        var tabStrip = $("#TabStrip").data("tTabStrip");
        if (combobox.value() != 0) {
            tabStrip.enable($(".t-item", tabStrip.element)[1]);
            tabStrip.enable($(".t-item", tabStrip.element)[2]);
        }
        else {
            tabStrip.disable($(".t-item", tabStrip.element)[1]);
            tabStrip.disable($(".t-item", tabStrip.element)[2]);
        }

        $.ajax({
            url: '@Url.Action("_GetMediaCategoryShort")',
            type: 'POST',
            data: { mediaCategoryID: combobox.value() },
            success: function (result) {
                jsonMediaShort = result;
                $("#InputJsonMediaShort").val(JSON.stringify(result));
                if (result.IsNewspaper) {
                    $("#dvTotalPublishedDaily").show();
                    $("#lblTotalPublishedDaily").html("How many exemplar published daily?");
                    $("#lblTotalViewersDaily").html("How many readers daily?");
                    if (!result.IsOnline) {
                        $("#dvTotalUsers").hide();
                    }
                    else {
                        $("#dvTotalUsers").show();
                    }
                    $("#lblViewerTypeID").html("<span class=\"field-required\">*</span>Who are the readers?");
                }
                else if (result.IsTV) {
                    $("#dvTotalPublishedDaily").hide();
                    $("#lblTotalViewersDaily").html("How many viewers daily?");
                    if (!result.IsOnline) {
                        $("#dvTotalUsers").hide();
                    }
                    else {
                        $("#dvTotalUsers").show();
                    }
                    $("#lblViewerTypeID").html("<span class=\"field-required\">*</span>Who are the viewers?");
                }
                else if (result.IsRadio) {
                    $("#dvTotalPublishedDaily").hide();
                    $("#lblTotalViewersDaily").html("How many listeners daily?");
                    if (!result.IsOnline) {
                        $("#dvTotalUsers").hide();
                    }
                    else {
                        $("#dvTotalUsers").show();
                    }
                    $("#lblViewerTypeID").html("<span class=\"field-required\">*</span>Who are the listeners?");
                }
                else if (result.IsOnlineNews) {
                    $("#dvTotalPublishedDaily").hide();
                    $("#lblTotalViewersDaily").html("How many users daily?");
                    $("#dvTotalUsers").hide();
                    $("#lblViewerTypeID").html("<span class=\"field-required\">*</span>Who are the users?");
                }
            }
        });
    }
    function addNewReporter() {
        $.ajax({
            url: '@Url.Action("AddNewReport")',
            type: 'POST',
            //dataType: 'html',
            success: function (result) {
                // TODO:
                $("#divReporters").append(result);
            }
        });
    }

    $('form').submit(function () {
        //if ($(this).valid()) {
            // client validation passed successfully
            var isValid = true;
            var isValidEmail = true;
            var collectionInputGuid = $(":input[name='ListReporter.index']");
            if (collectionInputGuid.length > 0) {
                for (var i = 0; i < collectionInputGuid.length; i++) {
                    var guid = collectionInputGuid[i].value;
                    var emailGuid = "ListReporter_" + guid + "__Email";
                    guid = "ListReporter_" + guid + "__Name";                    
                    var checkInput = $('#' + guid).val();
                    if (checkInput != "undefined") {
                        if (checkInput.length == 0) {
                            isValid = false;
                            break;
                        }
                    }
                    
                    var checkValEmail = $('#' + emailGuid).val();
                    if (checkValEmail != "undefined") {
                        if (checkValEmail.length > 0) {
                            var reg = /^([A-Za-z0-9_\-\.])+\@@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
                            if (reg.test(checkValEmail) == false) {
                                isValidEmail = false;
                                break;
                            }
                        }
                    }
                    
                }
                if (!isValid) {
                    alert("Please enter the name of Reporter you know.");
                    return false;
                }
                if (!isValidEmail) {
                    alert("Please enter correct the email of Reporter you know.");
                    return false;
                }
            }
        //}
        //else {
            //alert('there was an error during client validation');
            // cancel the submission of the form
            //return false;
        //}
    });

    function removeClick(e) {
        $(e).parent().remove();
    }
</script>
